<?xml version="1.0" encoding="UTF-8"?>
<html>
    <head>
        <link type="text/css" rel="stylesheet" href="./css/template.css" />
        <link type="text/css" rel="stylesheet" href="./css/SyntaxHighlighter.css" />
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Google Web Toolkit</title>
        <meta name="gwt:module" content="com.gwt.MyApplication" />
        <script language="javascript" src="./js/shInit.js" />
        <script language="javascript" src="./js/shCore.js" />
        <script language="javascript" src="./js/shBrushCpp.js" />
        <script language="javascript" src="./js/shBrushCSharp.js" />
        <script language="javascript" src="./js/shBrushCss.js" />
        <script language="javascript" src="./js/shBrushDelphi.js" />
        <script language="javascript" src="./js/shBrushJava.js" />
        <script language="javascript" src="./js/shBrushJScript.js" />
        <script language="javascript" src="./js/shBrushPhp.js" />
        <script language="javascript" src="./js/shBrushPython.js" />
        <script language="javascript" src="./js/shBrushRuby.js" />
        <script language="javascript" src="./js/shBrushSql.js" />
        <script language="javascript" src="./js/shBrushVb.js" />
        <script language="javascript" src="./js/shBrushXml.js" />
        <keywords>Applicatif,GWT</keywords>
        <author>Frédéric BIESSE</author>
    </head>
    <body>
        <div class="chapter">
            <h2>Introduction</h2>
            <p>
                Some time ago, Google released the Google Web Toolkit (GWT), a Java framework to create web application using 
                <abbr title="Asynchronous JavaScript and XML">AJAX</abbr>
                from Java code. This framework offer to Java developers who don't have time to learn Javascript, a powerful solution.
            </p>
            <p>
                Indeed, a code generator parse Java controllers, and listeners to generate the equivalent HTML and Javascript code. With this solution, a Java developer will keep all his coding habits without worrying of possible incompatibilities between web navigators (because various versions are generate for the most common web navigators such as, Firefox, Internet Explorer, Opera... and for iPhone too) to concieve its web site. In addition, this framework is already use in Google software like 
                <a href="http://www.google.com/reader" target="_blank">Google Reader</a>
                .
            </p>
        </div>
        <div class="chapter">
            <h2>Example</h2>
            <div class="subChapter">
                <h3>Installation of the framework</h3>
                <p>
                    The Google Web Toolkit, is under the Apache 2.0 licence, and available to download on the
                    <a target="_blank" href="http://code.google.com/webtoolkit/">official website</a>
                    of the project.
                </p>
            </div>
            <div class="subChapter">
                <h3>Creating a new project</h3>
                <p>
                    In order to use
                    <abbr title="Google Web Toolkit">GWT</abbr>
                    , you need to extract it, and in its folder, create a directory for the project, open a console, and go to the directory you have just created.
                </p>
                <p>To create a project for Eclipse, you just need to use those command :</p>
            </div>
            <p>To create a project :</p>
            <div class="subChapter">
                <span class="cmd_line">..\projectCreator -eclipse nameOfMyProject</span>
                <br />
            </div>
            <p>To create a web application :</p>
            <div class="subChapter">
                <span class="cmd_line">..\applicationCreator -eclipse nameOfMyProject com.gwt.client.MyApplication</span>
                <br />
            </div>
            <p>Then, you just need to import your project throught Eclipse.</p>
            <p>
                To improve your coding experience, you could grab this
                <a href="http://www.cypal.in/studio" target="_blank">plug-in</a>
                for Eclipse, or 
                <a href="https://gwt4nb.dev.java.net/" target="_blank">this one</a>
                for NetBeans.
            </p>
            <p>
                To see the result directly under Eclipse, you need to add the 
                <abbr title="Google Web Toolkit">GWT</abbr>
                library : gwt-dev-windows.jar or an equivalent if you are not under a Windows system.
            </p>
        </div>
        <div class="chapter">
            <h3>Example with a "Hello World"</h3>
            <p>An « Hello World » application has been created in com.gwt.client.MyApplication, this class source code :</p>
            <textarea name="code" class="java">package com.gwt.client;
				import com.google.gwt.core.client.EntryPoint;
				import com.google.gwt.user.client.ui.Button;
				import com.google.gwt.user.client.ui.ClickListener;
				import com.google.gwt.user.client.ui.Label;
				import com.google.gwt.user.client.ui.RootPanel;
				import com.google.gwt.user.client.ui.Widget;
				/**
				* Entry point classes define onModuleLoad().
				*/
				public class MyApplication implements EntryPoint {
				public void onModuleLoad() {
				final Button button = new Button("Click me");
				final Label label = new Label();
				button.addClickListener(new ClickListener() {
				public void onClick(Widget sender) {
				if (label.getText().equals(""))
				{
				label.setText("Hello World!");
				}
				else
				{
				label.setText("");
				}
				}
				});
				RootPanel.get("slot1").add(button);
				RootPanel.get("slot2").add(label);
				}
				}</textarea>
            <p>A correspondant HTML document has been created, it is globally the same :</p>
            <textarea name="code" class="html">
                Wrapper HTML for MyApplication
                <script language="javascript" src="gwt.js" />
                <span id="slot1" />
                <span id="slot2" />
            </textarea>
            <p>
                The result of this example is available 
                <a target="_blank" href="http://www.myjavaserver.com/~fredo/hellogwt/MonApplication.html">here</a>
                .
            </p>
            <p>As we could see in the HTML code, we get a slot1 and slot2 id element; both are references in the Java code, as containers of a button and a label, and where their events are managed by listeners.</p>
            <p>
                To execute the project under Eclipse, you can launch the binary
                <b>MyApplication-shell</b>
                .
            </p>
            <p>
                In all the cases, to create the Javacript file and all other necesary files to the execution in an application server, you need to launch the binary
				<b>MyApplication-compile</b>
                .
            </p>
            <p>
                To localy use your application, you just need to click on the "run" button of Eclipse and to specify the mainclass :
                <b>com.google.gwt.dev.GWTShell</b>
                for the main project, but in others cases, you will need an applicative server like Tomcat.
            </p>
        </div>
        <div class="chapter">
            <h2>
                Opportunities of
                <abbr title="Google Web Toolkit">GWT</abbr>
            </h2>
            <p>
                The Google Web Toolkit is interesting in many points. Indeed, this framework give the capacity for Java developers to easily create AJAX application, and you can use it in addition of many others Google
                <abbr title="Application Programming Interface">API</abbr>
                s, like Google Gears, wich bring you the opportunity to create online applications who could work offline as well! (
                <a href="http://wiki.apexdevnet.com/index.php/Building_Offline_Salesforce_Applications_with_Google_Gears_and_Google_Web_Toolkit" target="_blank">example</a>
                )
            </p>
            <p />
        </div>
    </body>
</html>

